<admintpl file="header" />
</head>
<body>
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
    <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=5067b5a7df11f017c2d95af5b7c19a6e"></script>
    <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
		<div style="z-index: 1;position: absolute;width: 100%;text-align: center;"> <b>此区域中共有 {:count($coordinates)} 个设备</b></div>
		<div id="container"></div>
	<if condition="$area_type eq 2">
	<script>
    var map = new AMap.Map('container', {
        resizeEnable: true,
        center: [{$areadevice['value_a']}],
        zoom: 9
    });
    var cluster, markers = [];
    <foreach name="coordinates" item="vo">
        var markerPosition = [{$vo.longitude},{$vo.latitude}];
        var marker = new AMap.Marker({
            position: markerPosition,
            icon: "http://amappc.cn-hangzhou.oss-pub.aliyun-inc.com/lbs/static/img/marker.png",
            offset: {x: -8,y: -34}
        });
        markers.push(marker);
    </foreach>
        	addCluster(0);
    function addCluster(tag) {
        if (cluster) {
            cluster.setMap(null);
        }
        if (tag == 1) {
            var sts = [{
                url: "http://lbs.amap.com/wp-content/uploads/2014/06/1.png",
                size: new AMap.Size(32, 32),
                offset: new AMap.Pixel(-16, -30)
            }, {
                url: "http://lbs.amap.com/wp-content/uploads/2014/06/2.png",
                size: new AMap.Size(32, 32),
                offset: new AMap.Pixel(-16, -30)
            }, {
                url: "http://lbs.amap.com/wp-content/uploads/2014/06/3.png",
                size: new AMap.Size(48, 48),
                offset: new AMap.Pixel(-24, -45),
                textColor: '#CC0066'
            }];
            map.plugin(["AMap.MarkerClusterer"], function() {
                cluster = new AMap.MarkerClusterer(map, markers, {
                    styles: sts
                });
            });
        } else {
            map.plugin(["AMap.MarkerClusterer"], function() {
                cluster = new AMap.MarkerClusterer(map, markers);
            });
        }
    }
    var polygonArr = new Array();//多边形覆盖物节点坐标数组
    	polygonArr.push([{$areadevice['value_a']}],[{$areadevice['value_b']}],[{$areadevice['value_c']}],[{$areadevice['value_d']}]);
    var  polygon = new AMap.Polygon({
        path: polygonArr,//设置多边形边界路径
        strokeColor: "#FF00FF", //线颜色
        strokeOpacity: 0.2, //线透明度
        strokeWeight: 2,    //线宽
        fillColor: "#1791fc", //填充色
        fillOpacity: 0.35//填充透明度
    });
    polygon.setMap(map);

</script>
</if>
<if condition="$area_type eq 3">
<script type="text/javascript">
    //初始化地图对象，加载地图
    var district, map = new AMap.Map("container", {
        resizeEnable: true,
        zoom: 9 //地图显示的缩放级别
    });
    addBeiJing();
    function addBeiJing() {
        //加载行政区划插件
        AMap.service('AMap.DistrictSearch', function() {
            var opts = {
                subdistrict: 1,   //返回下一级行政区
                extensions: 'all',  //返回行政区边界坐标组等具体信息
                level: 'city'  //查询行政级别为 市
            };
            //实例化DistrictSearch
            district = new AMap.DistrictSearch(opts);
            district.setLevel('district');
            //行政区查询
            district.search('<if condition="$areadevice['value_c']">{$areadevice['value_c']}<elseif condition="$areadevice['value_b']"/>{$areadevice['value_b']}<else/>{$areadevice['value_a']}</if>', function(status, result) {
                var bounds = result.districtList[0].boundaries;
                var polygons = [];
                if (bounds) {
                    for (var i = 0, l = bounds.length; i < l; i++) {
                        //生成行政区划polygon
                        var polygon = new AMap.Polygon({
                            map: map,
                            strokeWeight: 1,
                            path: bounds[i],
                            fillOpacity: 0.7,
                            fillColor: '#CCF3FF',
                            strokeColor: '#CC66CC'
                        });
                        polygons.push(polygon);
                    }
                    map.setFitView();//地图自适应
                }
            });
        });
    }
    var cluster, markers = [];
    <foreach name="coordinates" item="vo">
        var markerPosition = [{$vo.longitude},{$vo.latitude}];
        var marker = new AMap.Marker({
            position: markerPosition,
            icon: "http://amappc.cn-hangzhou.oss-pub.aliyun-inc.com/lbs/static/img/marker.png",
            offset: {x: -8,y: -34}
        });
        markers.push(marker);
    </foreach>
    	addCluster(0);
    function addCluster(tag) {
        if (cluster) {
            cluster.setMap(null);
        }
        if (tag == 1) {
            var sts = [{
                url: "http://lbs.amap.com/wp-content/uploads/2014/06/1.png",
                size: new AMap.Size(32, 32),
                offset: new AMap.Pixel(-16, -30)
            }, {
                url: "http://lbs.amap.com/wp-content/uploads/2014/06/2.png",
                size: new AMap.Size(32, 32),
                offset: new AMap.Pixel(-16, -30)
            }, {
                url: "http://lbs.amap.com/wp-content/uploads/2014/06/3.png",
                size: new AMap.Size(48, 48),
                offset: new AMap.Pixel(-24, -45),
                textColor: '#CC0066'
            }];
            map.plugin(["AMap.MarkerClusterer"], function() {
                cluster = new AMap.MarkerClusterer(map, markers, {
                    styles: sts
                });
            });
        } else {
            map.plugin(["AMap.MarkerClusterer"], function() {
                cluster = new AMap.MarkerClusterer(map, markers);
            });
        }
    }
</script>
	</if>
</body>
</html>